<template>
  <div class="suammry">
            <span>全部任务({{this.$store.state.toList.length}})</span>
            <span>已完成({{this.$store.state.toList.length-this.$store.getters.unFinish}})</span>
            <span>未完成( {{this.$store.getters.unFinish}} )</span>
        </div>
</template>

<script>
export default {

}
</script>

<style lang="scss" scoped>
.suammry {
            display: flex;
            align-items: center;
            font-size: 14px;
        }

        .suammry span {
            display: inline-block;
            padding: 5px 15px;
            border-radius: 5px;
            background-color: lightseagreen;
            margin: 10px 0;
            margin-right: 10px;
            color: white;
        }

        .suammry span:nth-child(3) {
            background-color: red;
        }
</style>